<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<link rel="stylesheet" href="${css }/ui-dialog.css">
<script src="${js }/dialog-min.js"></script>
<script type="text/javascript">
	function showLogin(){
		var d = dialog({
		    title: '请登录',
		    content: $('#login_dialog'),
		    button: [
		             {
		                 value: '提交',
		                 callback: function () {
		                     var userName = $(':input[name=userName]').val().trim();
		                     var password = $(':input[name=password]').val().trim();
		                     if(userName && password) {
		                    	 var params = $('#loginInfo').serialize();
		                    	 $.post('${ctx}/login?'+params, function(json){
		                    		 if(json){
		                    			 location.reload();//登陆成功，刷新页面
		                    		 } else {
				                    	 alert('用户名或密码错误');
		                    		 }
		                    	 },'json');
		                     } else {
		                    	 alert('用户名和密码不能为空');
		                     }
		                     return false;
		                 },
		                 autofocus: true
		             },
		             {
		                 value: '重置',
		                 callback: function () {
		                	 $(':input[name=userName]').val('');
		                     $(':input[name=password]').val('');
		                     return false;
		                 }
		             },
		             {
		                 value: '关闭'
		             }
		             ]
		});
		d.showModal();
	}
</script>
<div id="header">
	<div id="widgetBar">
		<div class="headerWidget">
			^_^感谢您惠顾妖怪商社。^_^ 
			<span class="split"></span>
			当前在线人数：${counter }
			<span class="split"></span>
			<c:if test="${not empty name}">
	        	欢迎:${name }
				<span class="split"></span>
	        	<a href='${ctx }/logout'>退出登陆</a>
				<span class="split"></span>
			</c:if>
			<c:if test="${empty name}">
				<a href="javascript:showLogin();">请登陆</a>
				<span class="split"></span>
				<a href='${ctx }/register.jsp'>还没有账号？</a>
				<span class="split"></span>
			</c:if>
			<a href='${ctx }/cart/view'> [ 购物车 ] </a>
		</div>

	</div>

	<img src="${img }/logo.jpg" id="logo" alt="imtshop logo">
	<img src="${img }/logotext.jpg" id="logoText" alt="imtshop">

</div>
<!-- 登陆对话框 -->
<div id="login_dialog">
	<span style="color: red;">${not empty loginError ? loginError : ''}</span>
	<form action="${ctx }/login" method="post" name="loginInfo" id="loginInfo">
		<table style="margin: auto;">
			<tr>
				<td></td>
				<td align="center">用户登录</td>
			</tr>
			<tr>
				<td>用户名:</td>
				<td><input type="text" name="userName" id="uname" /></td>
			</tr>
			<tr>
				<td>密码:</td>
				<td><input type="password" name="password" id="upwd" /></td>
			</tr>
			<tr>
				<td>记住一周:</td>
				<td><input type="checkbox" name="remenberMe" id="remenberMe" /></td>
			</tr>
		</table>
	</form>
	<p align="right">
		<a href='findpassword.jsp'>忘记密码了？^ 。^</a>
	</p>
</div>